<template>
  <MdPreview :editorId="id" :modelValue="text" />
  <MdCatalog :editorId="id" :scrollElement="scrollElement" />
</template>

<script setup>
import { ref } from 'vue'
import request from '@/utils/request'
import { MdPreview, MdCatalog } from 'md-editor-v3'
// preview.css相比style.css少了编辑器那部分样式
import 'md-editor-v3/lib/preview.css'

const id = 'preview-only'
const text = ref('# Hello Editor')
const scrollElement = document.documentElement
let result = request
  .post('http://127.0.0.1:8888/api/getArticles')
  .then((result) => {
    console.log(typeof result.data)
    console.log(result)
    let da = JSON.stringify(result.data.article_content)
    da = da.slice(1, -1)
    da = da.replace(/\\n/g, '\n')
    text.value = da
  })
  .catch((err) => {
    console.log(err)
  })
</script>
